<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>let-const-var在for循环中的使用原理</title>
</head>
<body>
    <script>
        // for (var i = 1; i < 5; i++) {
        //     console.log(i);
        // }
        // // var没有块级作用域的特性，会把i放到全局中，所以可以在外面打印i
        // // console.log(i);


        // for (let j = 1; j < 5; j++){
        //     console.log(j);
        // }
        // // let有块级作用域的特性，不会把i放到全局中，所以在外面不可以打印i
        // // console.log(j);



        // var没有块级作用域的特性，虽然每次都给定时器函数开辟一个新的空间，但m放到全局中,隔了1s之后，每一块的定时器都会去全局中找m，这时候m已经变成5了，打印结果是4个5
        for (var m = 1; m < 5; m++) {
            setTimeout(() => {
                console.log(m);
            }, 1000);
        }


        // let有块级作用域的特性，每次都将n保存在对应的块中，并在块中给定时器函数开辟一个新的空间，隔了1s之后，每一块的定时器到对应的块中去取n，打印结果是1,2,3,4
        for (let n = 1; n < 5; n++) {
            setTimeout(() => {
                console.log(n);
            }, 1000);
        }




        // 模拟var的伪块级作用域
        // var虽然没有块级作用域，但有函数作用域，我们是用一个立即执行函数将它包裹起来,在每一个函数作用域中开辟一个定时器函数空间，因为定时器函数要使用，所以函数作用域中的k也被保留，隔了1s之后，每一块的定时器到对应的函数作用域中去取k，打印结果是1,2,3,4
        for (var k = 1; k < 5; k++) {
            (
                function(k){
                    setTimeout(() => {
                        console.log(k);       
                    }, 1000);
                }
            )(k);
        }
    </script>
</body>
</html>